

<template >
    <legend>数据统计</legend>
    <div class="box" ref="box"></div>
</template>

<style scoped>
.box {
  height: 600px;
}
</style>

<script setup lang="ts">
import * as echarts from "echarts";
import axios from "axios";
import { ref, reactive, watchEffect } from "vue";
import taskOption from "../echarts/task.js"

const box = ref<HTMLInputElement | null>(null)

interface a {
  type: string
  name?: string
  [key: string]: string | undefined
}

// defineProps<{ msg: string }>()

// const count = ref(0)

watchEffect((): void => {
  let myCharts = echarts.init(box.value!)
  axios.get('http://chst.vip/data/tarsk.json')
    .then(res => {
      interface b {
        name: string
        value: number
      }
      let data: Array<b> = res.data.data;
      taskOption.series[0].data = data;
      myCharts.setOption(taskOption)
    })

}
  , {
    flush: "post"
  })
</script>